import { useState, useEffect } from 'react';
import { Redirect } from 'react-router-dom';

import UserPost from './UserPosts';

import { User } from '../../../model/user';
import auth from '../../../page/auth';

function PageUserSummary() {
  const [authenticated, setAuthenticated] = useState<boolean>(true);
  const [user, setUser] = useState<User | undefined>(undefined);

  useEffect(() => {
    auth.user.subscribe(({ authenticated, user }) => {
      setAuthenticated(authenticated);
      setUser(user);
    });
  }, [authenticated]);

  if (authenticated) {
    return (
      <div>
        <pre>{JSON.stringify(user)}</pre>
        <UserPost />
      </div>
    );
  } else return <Redirect to="/" />;
}

export default PageUserSummary;
